<cfinclude template="/includes/topbar.cfm" />
<script type="text/javascript" src="/assets/js/newfund.js"></script>

<cfoutput>
	
	<div class="underwrapper">
		<div class="titlemsg">
			<h2>Create a fund and raise some money!</h2>
		</div>
		<form id="newFundForm" onsubmit="javascript:return Newfund.validateForm();" action="#application.q.form('fundController','createFund')#" method="post">
			<table width="100%" class="newfund" cellspacing="0" cellpadding="0">
				<tr>
					<td class="newfund_left">
						Fundr charges a 6% fee for all withdrawls ($<span id="fundrFee" class="dynamic">0</span>)<br />Minimum withdrawal is $10
					</td>
					<td class="newfund_mid">
						1<br />Fund Goal
					</td>
					<td class="newfund_right">
						$ <input type="text" value="" name="amount" placeholder="Amount" validate="money,positive" /> 
						<input id="next_1" type="button" class="button" style="font-weight:bold; margin: 4px 10px 0 0;" value="Next" onclick="javascript:Newfund.showStepTwo();"/>
					</td>
				</tr>
				<tr id="createFundRow_2" style="display:none;">
					<td class="newfund_left">
						Generates the name of the fund<br />
						<input type="hidden" name="name" value="" />
						"<span id="fundrName" class="dynamic">$1 towards [Some item or service] for [some person or people]</span>."
					</td>
					<td class="newfund_mid">
						2<br />Fund Name
					</td>
					<td class="newfund_right">
						<input type="text" value="" name="what_for" class="fund_name" placeholder="What will this fund pay for?" /><br />
						<input type="text" value="" name="who_benefit" class="fund_who" placeholder="Who will this fund benefit?" />
						<input id="next_2" type="button" class="button" style="font-weight:bold; margin: 4px 10px 0 0;" value="Next" onclick="javascript:Newfund.showStepThree();"/>
					</td>
				</tr>
				<tr id="createFundRow_3" style="display:none;">
					<td class="newfund_left">
						Describe this fund further for your donors
					</td>
					<td class="newfund_mid">
						3<br />Details
					</td>
					<td class="newfund_right">
						<textarea name="description" cols="30" rows="5" placeholder="description"></textarea>
						<input id="next_3" type="button" class="button" style="font-weight:bold; margin: 4px 10px 0 0;" value="Next" onclick="javascript:Newfund.showStepFour();"/>
					</td>
				</tr>
				<tr id="createFundRow_4" style="display:none;">
					#application.u.fundUtil.renderStepFour()#
				</tr>
				<tr id="createFundRow_5" style="display:none;">
					#application.u.fundUtil.renderStepFive()#
				</tr>
				<tr id="createFundRow_6" style="display:none;">
					<td class="newfund_left">
						(Optional) End date for collecting funds
					</td>
					<td class="newfund_mid">
						6<br />End Date
					</td>
					<td class="newfund_right">
						<input type="date" name="end_date" placeholder="dd/mm/yyyy" />
						<input id="createFundSubmit" onclick="javascript:document.forms['newFundForm'].submit();" type="button" class="button" style="float: right;font-weight:bold; margin: 4px 10px 0 0;" value="Create Fund" />
					</td>
				</tr>
			</table>
		</form>
	</div>
</cfoutput>